<!-- 单据详情 组件 -->
<template>
   <div class="documentParticulars detail_arr detail_arr_ls">
      <div v-for="(item,index) in list" :key="index" class="detail_arr" style="margin: 4px 0;">
         <div class="line_2_line">{{item.name || item.label}} : </div>
         <template v-if="item.list_key">
            <el-tooltip 
               class="item" 
               effect="dark" 
               :content="String(item.value)" 
               placement="top"
            >
               <div class="line_1_line" >
                  {{item.value}}
               </div>
            </el-tooltip>
         </template>

         <template v-else>
            <el-tooltip class="item" effect="dark" :content="String(item.value)" placement="top">
               <div class="line_1_line">{{item.value}}</div>
            </el-tooltip>
         </template>
      </div>
   </div>
</template>

<script>
   export default {
      name: 'documentParticulars',
      props: {
         list: {
            type: Array,
            default: () => []
         },

      },
      data() {
         return{
            
         }
      },
      methods:{
         
      },
      mounted(){
         
      },
      created(){
         this.list = this.list
      }
   ,}
</script>

<style lang="less">
.detail_arr{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  .line_2_line{
    padding-right: 10px;
    width: 117px;
    text-align: right;
    box-sizing: border-box;
    font-size: 14px;
  }
  .line_1_line{
    box-sizing: border-box;
    font-size: 14px;
    width: 190px;
    background: #eee;
    height: 28px;
    padding: 0 10px;
    background-color: #eee;
    line-height: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    
  }
}
</style>